<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html>

<head>
    <meta charset="UTF-8">
    <title>固件列表</title>
    <meta name="ctx" th:content="${#httpServletRequest.getContextPath()}"/>
    <link rel="stylesheet" th:href="@{/lib/flatpickr/flatpickr.min.css}">
    <link rel="stylesheet" th:href="@{/css/admin/base-v2.css}">
    <link rel="stylesheet" th:href="@{/lib/font-awesome/4.7.0/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/css/admin/app.css}">
</head>

<body>
    <div class="app-page">
        <div class="app-page-header">
            <div class="page-title">
                <div class="title">固件列表</div>
                <div class="btn-group">
                    <a class="z-btn z-primary" th:href="@{/firmWare/addFirmwareForward}">新增</a>
                </div>
            </div>
        </div>
        <div class="app-page-content">
            <div class="app-card">
                <div class="app-card-body">
                    <table class="z-table">
                        <thead>
                            <th>固件名称</th>
                            <th>上传时间</th>
                            <th>版本号</th>
                            <th>适用机型</th>
                            <th>大小(MB)</th>
                            <th>是否升级</th>
                            <th>操作</th>
                        </thead>
                        <tbody th:each="resultList : ${resultList}">
                            <tr th:attr="
                                        data-name=${resultList.name},
                                        data-version-name=${resultList.versionName},
                                        data-model=${resultList.model},
                                        data-size=${resultList.size},
                                        data-description=${resultList.softwareVersionDescription},
                                        data-device-upgrade-id=${resultList.deviceUpgradeId},
                                        data-url=${resultList.url}
                            ">
                                <td>
                                    <a class="btn-detail">
                                        <span th:text="${resultList.name}"></span>
                                    </a>
                                </td>
                                <td>
                                    <span th:text="${resultList.updateTime}"></span>

                                </td>
                                <td>
                                    <span th:text="${resultList.versionName}"></span>
                                </td>
                                <td>
                                    <span th:text="${resultList.model}"></span>
                                </td>
                                <td>
                                    <span th:text="${resultList.size}"></span>
                                </td>
                                <td>
                                    <span th:if="${resultList.active} eq '0'">否</span>
                                    <span th:if="${resultList.active} eq '1'">是</span>
                                </td>
                                <td class="z-hide">
                                    <span th:text="${resultList.deviceUpgradeId}"></span>
                                </td>
                                <td class="btn-group">
                                    <a class="btn-upgrade">升级</a>
                                    <a th:onclick="'javascript:updateFirmWareForward('+${resultList.deviceUpgradeId}+')'">寄存固件</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <!-- 分页信息 -->
                <div class="app-card-body">
                    <!-- 前端分页 -->
                    <div class="pagination z-pat z-fr"></div>
                </div>
            </div>
        </div>
    </div>

    <!-- 固件详情 -->
    <div class="popup-detail popup-default z-popup z-fixed z-df z-flex-cc z-hide">
        <div class="bg" data-popup-close></div>
        <div class="body">
            <div class="title">固件详情</div>
            <div class="content">
                <form>
                    <div class="form-item row">
                        <div class="label">
                            <label>固件名称</label>
                        </div>
                        <div class="body">
                            <input type="text" name="name" readonly>
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>版本号</label>
                        </div>
                        <div class="body">
                            <input type="text" name="versionName" readonly>
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>适用机型</label>
                        </div>
                        <div class="body">
                            <input type="text" name="model" readonly>
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>大小(MB)</label>
                        </div>
                        <div class="body">
                            <input type="text" name="size" readonly>
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>固件版本说明</label>
                        </div>
                        <div class="body">
                            <input type="text" name="description" readonly>
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>下载地址</label>
                        </div>
                        <div class="body">
                            <input type="text" name="url" readonly>
                        </div>
                    </div>
                </form>
                <div class="z-btn-group">
                    <a class="z-btn z-primary" data-popup-close>返回</a>
                </div>
            </div>
        </div>
    </div>

    <!-- 固件升级 -->
    <div class="popup-upgrade popup-default z-popup z-fixed z-df z-flex-cc z-hide">
        <div class="bg" data-popup-close></div>
        <div class="body">
            <div class="title">固件升级</div>
            <div class="content">
                <form>
                    <input type="text" class="z-hide" name="deviceUpgradeId" >
                    <div class="form-item row">
                        <div class="label">
                            <label>升级包地址</label>
                        </div>
                        <div class="body">
                            <input type="text" name="url">
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>固件名称</label>
                        </div>
                        <div class="body">
                            <input type="text" name="name">
                        </div>
                    </div>
                    <div class="form-item row">
                        <div class="label">
                            <label>版本号</label>
                        </div>
                        <div class="body">
                            <input type="text" name="versionName">
                        </div>
                    </div>
                    <div class="form-item row" style="align-items:start;">
                        <div class="label">
                            <label>固件版本说明</label>
                        </div>
                        <div class="body">
                            <textarea name="softwareVersionDescription"></textarea>
                        </div>
                    </div>
                </form>
                <div class="z-btn-group">
                    <a class="btn-submit z-btn z-primary">升级</a>
                    <a class="z-btn z-default" data-popup-close>取消</a>
                </div>
            </div>
        </div>
    </div>

    <script th:src="@{/lib/jquery.min.js}"></script>
    <script th:src="@{/lib/layer-v3.1.1/layer/layer.js}"></script>
    <script th:src="@{/js/form.js}"></script>
    <script th:src="@{/js/popup.js}"></script>
    <script th:src="@{/js/admin/app.js}"></script>
    <script th:src="@{/js/pagination.js}"></script>
    <script th:src="@{/lib/flatpickr/flatpickr.js}"></script>
    <script th:src="@{/lib/flatpickr/zh.js}"></script>
    <script>
        //获取context path
        //var context = $("meta[name='ctx']").attr("content");
        var context = $("meta[name='ctx']").attr("content") || '';

        //分页
        var pageNum =  [[${pageNum}]];
        var pageSize = [[${pageSize}]];
        var total = [[${total}]];
        var pagination = new Pagination(".pagination", {
            pageIndex: pageNum, // 当前页数
            pageSize: pageSize, // 每页数量
            count: total, // 总条数
            maxButtonCount: 5, // 分页按钮数量(可选)
            // 分页切换事件
            onPageChanged: function(pageIndex) {
                window.location.href = context + "/firmWare/listByPage?pageNum=" + pageIndex + "&pageSize=" + pageSize ;
            }
        })

        var currentData;

        // 详情
        $('.btn-detail').click(function(params) {
            var data = $(this).parents('tr')[0].dataset;

            // 赋值
            $('.popup-detail').formLoad({
                name: data.name,
                versionName: data.versionName,
                model: data.model,
                size: data.size,
                description: data.description,
                url: data.url
            })

            popup.open('.popup-detail');
        })

        // 升级
        $('.btn-upgrade').click(function(params) {
            currentData = $(this).parents('tr')[0].dataset;
            // TODO 升级跳转到更新页面
            if(currentData.deviceUpgradeId == null || "" == currentData.deviceUpgradeId) {
                popup.tipsTop("固件ID错误，请刷新后重试", 'warning');
            }else {
                window.location.href = context + "/firmWare/promoteFirmwareForward?deviceUpgradeId=" + currentData.deviceUpgradeId;
            }
        })

        // 升级 -确认
        // 保存
        var form = $(".popup-upgrade").form({
            submitSelector: ".popup-upgrade .btn-submit",
            msg: function(msg) {
                popup.tipsTop(msg, 'warning');
            },
            submit: function() {

                var data = {};

                $.each($(".popup-upgrade form").serializeArray(), function(index, field) {
                    if (data[field.name]) {
                        data[field.name] += "," + field.value;
                    } else {
                        data[field.name] = field.value;
                    }
                })

                console.log(data);
                if (!data.deviceUpgradeId) {
                    return popup.tipsTop('固件ID不存在', 'warning');
                }
                if (!data.url) {
                    return popup.tipsTop('请填写固件地址', 'warning');
                }
                if (!data.name) {
                    return popup.tipsTop('请填写固件名称', 'warning');
                }
                if (!data.versionName) {
                    return popup.tipsTop('请填写版本号', 'warning');
                }
                //固件
                $.ajax({
                    type: "POST",
                    url: context + "/firmWare/upgradeFirmWare",
                    data: data,
                    success: function (obj) {
                        var code = obj.code;
                        if (code == 0) {
                            //跳转到列表界面
                            popup.tipsTop(obj.msg, 'success');
                            setTimeout(function (args) {
                                window.location.href = context + "/firmWare/listByPage";
                            },2000);
                            // window.location.href = context + "/firmWare/listByPage";
                        } else {
                            popup.tipsTop(obj.msg, 'warning');
                        }
                    }
                })
            }
        })

        /**
         * 打开更新固件页面
         */
        function updateFirmWareForward(deviceUpgradeId) {
            if(deviceUpgradeId == null || "" == deviceUpgradeId) {
                popup.tipsTop("固件错误，请刷新后重试", 'warning');
                return ;
            }else {
                window.location.href = context + "/firmWare/updateFirmWareForward?deviceUpgradeId=" + deviceUpgradeId;
            }
        }
    </script>
</body>

</html>